import { createRouter, createWebHistory } from 'vue-router'
import nodeRoutes from './modules/node'
import siteRoutes from './modules/site'
import systemRoutes from './modules/system'
import analysisRoutes from './modules/analysis'
import authRoutes from './modules/auth'
import licenseRoutes from './modules/license'
import { useAppStore } from '@/stores/app'
import { ref } from 'vue'

// 添加一个全局的 key 来触发组件重新渲染
export const globalKey = ref(0)
// 添加动画类型控制变量，可以在不同的抖动效果之间切换
export const animationType = ref('shake')
// 可选的动画类型列表
export const animationTypes = [
  'shake' // 左右抖动
  // 'bounce', // 上下弹跳
  // 'wobble', // 摇晃
  // 'pulse', // 脉冲缩放
  // 'flip', // 翻转
  // 'jello' // 果冻效果
]

// 切换动画类型的函数
export function switchAnimationType() {
  const currentIndex = animationTypes.indexOf(animationType.value)
  const nextIndex = (currentIndex + 1) % animationTypes.length
  animationType.value = animationTypes[nextIndex]
  return animationType.value
}
const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/sign-in',
      name: 'SignIn',
      component: () => import('@/views/auth/signIn.vue')
    },
    {
      path: '/install',
      name: 'InitConf',
      component: () => import('@/views/auth/InitConfig.vue')
    },
    {
      path: '/',
      name: 'Workbench',
      component: () => import('@/views/layout/DefaultLayout.vue'),
      redirect: '/overview',
      children: [
        {
          path: '/overview',
          name: 'Overview',
          component: () => import('@/views/overview/Overview.vue'),
          meta: {
            title: '首页概览',
            showPageHeader: true,
            showBack: false,
            currentActiveMenu: 'Workbench'
          }
        },
        ...siteRoutes,
        ...nodeRoutes,
        ...systemRoutes,
        ...analysisRoutes,
        ...authRoutes,
        ...licenseRoutes,
        {
          path: '/logout',
          name: 'LogOut',
          component: () => import('@/views/LogOut.vue'),
          meta: {
            title: '退出登录',
            showPageHeader: true,
            showBack: false
          }
        }
      ]
    },
    {
      path: '/:pathMatch(.*)*',
      name: 'NotFound',
      component: () => import('@/views/NotFound.vue')
    }
  ]
})
// router.beforeEach((to, _from, next) => {
//   const appStore = useAppStore()
//   if (!appStore.token && to.name !== 'SignIn') {
//     return next({
//       name: 'SignIn',
//       query: { redirect: to.fullPath }
//     })
//   }
//   next()
// })
router.beforeEach((to, from, next) => {
  const appStore = useAppStore()

  // 增加 key 值以触发组件重新渲染
  globalKey.value++
  if (to.name !== 'FlowAnalyze' && to.name !== 'safeAnalyze') {
    appStore.initSiteStatistic()
  }
  if (
    !['NodeBandwidth', 'NodeLink', 'NodeCpu', 'NodeMemory'].includes(
      to.name as string
    )
  ) {
    appStore.initNodeStatistic()
  }
  if (appStore.token && to.name === 'SignIn') {
    next(from)
    return
  }

  if (
    !appStore.token &&
    !['Authorize', 'InitConf', 'SignIn'].includes(to.name as string)
  ) {
    return next({
      name: 'SignIn'
      //query: { redirect: to.fullPath }
    })
  }

  if (
    appStore.authInfo?.status !== 1 &&
    !['Authorize', 'InitConf', 'SignIn', 'LogOut'].includes(to.name as string)
  ) {
    return next({
      name: 'Authorize'
      //query: { redirect: to.fullPath }
    })
  }
  // if (appStore.authInfo && appStore.authInfo?.status !== 1) {
  //   // return next({
  //   //   //name: 'SignIn'
  //   //   //query: { redirect: to.fullPath }
  //   // })
  // }
  next()
})
export default router
